{% extends "templates/home.html" %}

{% block stylesheet %}
{{ super() }}
<link rel="stylesheet" href="{{ static_url("css/primehub/home.css") }}" type="text/css" />
{% endblock %}

{% block main %}
<div class="container">
  <div class="row">
    <div class="text-center">
      {% if (user.spawner and
             user.spawner.ready and
             user.spawner.active_group and
             user.spawner.launch_group and
             user.spawner.active_group != user.spawner.launch_group)
      %}
      <h3>The current server is launched by another group ({{ user.spawner.launch_group }})</h3>
      {% endif %}

      {% if default_server.active %}
        <a id="stop" role="button" class="btn btn-lg btn-danger">
          Stop My Server
        </a>
      {% endif %}
      <a id="start" role="button" class="btn btn-lg btn-primary" href="{{ url }}">
      {% if not default_server.active %}Start{% endif %}
      My Server
      </a>
    </div>
  </div>
  <div class="row">
    {% if default_server.active and default_server.ssh_config['enabled'] %}
    <div id="ssh-information">
      <h3>SSH Server Instruction</h3>
      🔑&emsp;<strong>From your jupyter notebook</strong>
      <p>
        Add your public key into <code>~/.ssh/authorized_keys</code> in your jupyter notebook. <a href="https://docs.primehub.io/docs/next/guide_manual/ssh-config#deploy-public-key-into-jupyterhub" rel="noreferrer" target="_blank">[Doc]</a>
      </p>
      💻&emsp;<strong>From your local machine</strong>
      <p>
        Copy and paste the example below into your <code>~/.ssh/config</code>. Then replace <code>~/.ssh/id_rsa</code> with your private key location.
      </p>
      <p>
        <pre class='snippet'><code>HOST {{ default_server.ssh_config['hostname'] }}
  User jovyan
  Hostname {{ default_server.ssh_config['hostname'] }}
  Port 22
  ForwardAgent yes
  ProxyCommand ssh -W %h:%p -i <i>~/.ssh/id_rsa</i> limited-user@{{ default_server.ssh_config['host'] }} -p {{ default_server.ssh_config['port'] }}
  IdentityFile <i>~/.ssh/id_rsa</i>
  StrictHostKeyChecking no
  UserKnownHostsFile=/dev/null</code></pre>
      </p>
      <p>
        After these steps, you will be able to successfully connect to your notebook.
      </p>
      <p>
        <pre class='snippet'><code>$ ssh jupyter</code></pre>
      </p>
    </div>
    {% endif %}
  </div>
</div>
{% endblock main %}
{% block script %}
{{ super() }}
<script type="text/javascript">
require(["jquery"], function(
  $
) {
  // Open in new tab when clicking "My server"
  {% if default_server.active %}
    $("#start").attr("target", "primehub-notebook");
    {% if default_server.launch_path %}
      $("#start").attr("href", "/hub/user-redirect/lab/tree/{{ default_server.launch_path }}");
      window.open("/hub/user-redirect/lab/tree/{{ default_server.launch_path }}", "primehub-notebook").focus();
    {% endif %}
  {% endif %}

  // On stop button is clicked, "My server" would be grayed out. And then change to "Start my server"
  // In this case, we don't want to open in new tab
  $("#stop").click(function() {
    $("#start").removeAttr("target");
    $("#ssh-information").hide();
  });

  // force refresh the access token in case to get 403 in the API call.
  // please see ch12047
  setTimeout(function(){
    window.location.reload();
  }, 5 * 60 * 1000);
});
</script>

{% endblock %}
